<%@page pageEncoding="UTF-8" %>

<script>
    $(function () {
        $('#myBannerTable').datagrid({
            url:'${pageContext.request.contextPath}/banner/selectBanner',
            pagination:true,
            //双击一行进行修改
            onDblClickRow:function (rowIndex,rowData) {
                onDblClickRowUpdate(rowData);
             },
            columns:[[
                {title:'编号',field:'bannerId',width:100},
                {title:'轮播图',field:'bannerImageurl',
                    formatter:function (value,rowdata,index) {
                        return "<img src='${pageContext.request.contextPath }/img/"+value+"' style=width:30px;height:30px;>"
                    }

                },
                {title:'标题',field:'bannerOldname',width:100},
                {title:'时间',field:'bannerDate',width:100},
                {title:'详情',field:'bannerDescription',width:100},
                {title:'状态',field:'bannerState',width:100,
                    formatter:function (value,rowdata,index) {
                        if(value==1){
                            return "删除";
                        }else {
                            return "正常";
                        }
                    }
                },
                {title:'操作',field:'cz',width:100,formatter:function (value,rowdata,index) {
                    if(rowdata.bannerState==2){
                        return "<a id='btn' href='javascript:void(0)' onclick=\"onclick=shanchubanner('"+rowdata.bannerId+"')\">删除</a>"
                    }else {
                        return "已删除"
                    }

                }}
            ]]
        });
    })

    //点击事件  触发事件之后打开对话框
    function tianjiabanner() {
        $('#mybannerdiv').dialog("open");
    }

    //添加对话框
    $(function () {
        $('#mybannerdiv').dialog({
            title: '添加轮播图',
            width: 400,
            height: 200,
            closed: true,
        });
    })

    //修改对话框
    $(function () {
        $('#myupdatebannerdiv').dialog({
            title: '修改轮播图',
            width: 400,
            height: 200,
            closed: true,
        });
    })
    
    function tijiaobanner() {
        $('#myBannerForm').form('submit', {
                url:"${pageContext.request.contextPath}/banner/insertBanner",
            onSubmit: function(){
            // do some check
            // return false to prevent submit;
        },
            success:function(data){

                var data1 = JSON.parse(data);
                alert(data1)
                if(data1.insertBaanner){
                    alert("添加成功");
                    $('#mybannerdiv').dialog("close");
                    $('#myBannerTable').datagrid("reload");
                }else {
                    alert("添加失败");
                }
            }
        });
    }

    //修改
    function onDblClickRowUpdate(rowData) {
        $('#myupdatebannerdiv').dialog("open");
        var bannerDescription = rowData.bannerDescription;
        $("#oldtupian").attr("src","${pageContext.request.contextPath}/img/"+rowData.bannerImageurl)
        //双击一行之后开对话框  把要修改的内容显示在对话框中
        $("#updatebannerOldname").val(rowData.bannerOldname)
        $("#updatebannerDescription").val(rowData.bannerDescription)
    }

    //删除
    function shanchubanner(bannerId) {
        $.ajax({
            url:"${pageContext.request.contextPath}//banner/deleteBanner",
            type:"post",
            data:"bannerId="+bannerId,
            success:function (data) {
                if(data.bannerdelete){
                    alert("删除成功");
                    $('#myBannerTable').datagrid("reload")
                }else {
                    alert("删除失败");
                }
            }

        })


    }






</script>

<a id="btn" href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-add'" onclick="tianjiabanner()">添加</a>
<%--数据展示--%>
<table id="myBannerTable"></table>

<%--添加数据--%>
<div id="mybannerdiv">
    <form id="myBannerForm" method="post" enctype="multipart/form-data">
        标题:<input type="text" name="bannerOldname"><br/>
        图片:<input type="file" name="touxiang"><br/>
        详情:<input type="text" name="bannerDescription"><br/>
        <input type="button" onclick="tijiaobanner()" value="提交">
    </form>
</div>


<%--修改--%>
<div id="myupdatebannerdiv">
    <form id="myupdateBannerForm" method="post" enctype="multipart/form-data">
        <input type="text" id="updatebannerId" name="bannerId"><br/>
        标题:<input type="text" id="updatebannerOldname" name="bannerOldname"><br/>
        <img src="" id="oldtupian" style=width:30px;height:30px;/><br/>
        新图片:<input type="file" id="updatetouxiang" name="touxiang"><br/>
        详情:<input type="text" id="updatebannerDescription" name="bannerDescription"><br/>
        <input type="button" onclick="updatebanner()" value="提交">
    </form>
</div>

